<style>
    .top{
        margin-top: 10px;
        text-align: center;
    }
    .layui-table th{
        text-align: center;
    }
</style>
<div class="layuimini-container">
    <div class="layuimini-main" style="padding: 15px 0;">

        <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
            <ul class="layui-tab-title">
                <li class="layui-this">今日</li>
                <li>昨日</li>
                <li>本月</li>
                <li>全部</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    {include file="statistics/today" /}
                </div>
                <div class="layui-tab-item">
                    {include file="statistics/yesterday" /}
                </div>
                <div class="layui-tab-item">
                    {include file="statistics/month" /}
                </div>
                <div class="layui-tab-item">
                    {include file="statistics/all" /}
                </div>
            </div>
        </div>
        <div class="layui-col-xs8 top">
            <div class="layui-card">
                <div class="layui-card-header"><i class="fa fa-line-chart icon"></i>成交金额</div>
                <div class="layui-card-body">
                    <div id="echarts-records" style="width: 100%;min-height:400px"></div>
                </div>
            </div>
        </div>
        <div class="layui-col-xs4 top" style="width: 33%;float: right;text-align: left;">
            <div class="layui-card">
                <div class="layui-card-header">销售记录</div>
                <div class="layui-card-body" style="height: 400px;">
                    <div style="text-align: center;font-family: 'Roboto', sans-serif;">
                        <div style="margin: 10px 0 20px 0;">
                            <h2 style="font-weight: 700;">销售记录统计</h2>
                        </div>
                        <div style="margin-top: 50px;">
                            <div style="height: 60px;line-height: 60px;">
                                <span>今日新增：{$sales.today}</span>
                            </div>
                            <div style="height: 60px;line-height: 60px;">
                                <span>今日完成：{$sales.success.'%'}</span>
                            </div>
                            <div style="height: 60px;line-height: 60px;">
                                <span>全部记录：{$sales.all}</span>
                            </div>
                            <div style="height: 60px;line-height: 60px;">
                                <span>失败比例：{$sales.error.'%'}</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-col-xs4 top">
            <div class="layui-card">
                <div class="layui-card-header" style="text-align: left;">今日排名</div>
                <div class="layui-card-body">
                    <div style="width: 100%;min-height:420px">
                        <table class="layui-table" lay-skin="nob">
                            <thead>
                            <tr>
                                <th>排名</th>
                                <th>员工姓名</th>
                                <th>追销次数</th>
                            </tr>
                            </thead>
                            <tbody>
                            {foreach $today_ranking as $k => $v}
                            <tr>
                                <td>{$k+1}</td>
                                <td>{$v.true_name}</td>
                                <td>{$v.num}</td>
                            </tr>
                            {/foreach}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-col-xs4 top">
            <div class="layui-card">
                <div class="layui-card-header" style="text-align: left;">昨日排名</div>
                <div class="layui-card-body">
                    <div style="width: 100%;min-height:420px">
                        <table class="layui-table" lay-skin="nob">
                            <thead>
                            <tr>
                                <th>排名</th>
                                <th>员工姓名</th>
                                <th>追销次数</th>
                            </tr>
                            </thead>
                            <tbody>
                            {foreach $yesterday_ranking as $k => $v}
                            <tr>
                                <td>{$k+1}</td>
                                <td>{$v.true_name}</td>
                                <td>{$v.num}</td>
                            </tr>
                            {/foreach}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-col-xs4 top">
            <div class="layui-card">
                <div class="layui-card-header" style="text-align: left;">本月排名</div>
                <div class="layui-card-body">
                    <div style="width: 100%;min-height:420px">
                        <table class="layui-table" lay-skin="nob">
                            <thead>
                            <tr>
                                <th>排名</th>
                                <th>员工姓名</th>
                                <th>追销次数</th>
                            </tr>
                            </thead>
                            <tbody>
                                {foreach $month_ranking as $k => $v}
                                <tr>
                                    <td>{$k+1}</td>
                                    <td>{$v.true_name}</td>
                                    <td>{$v.num}</td>
                                </tr>
                                {/foreach}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    var chart_data = {$chart_data|raw};
</script>